<template>
    <div id="news-info">
        <!--头部-->
        <div class="head">
            <span class="iconfont" onclick="javascript :history.go(-1);">&#xe602;</span>
            <div class="title-img">
                <a href="/">
                    资讯详情
                </a>
            </div>
            <a href="javascript:void(0);" class="share">
                <i class="iconfont">&#xe61b;</i>
            </a>
        </div>

        <article class="w clearfix">
            <h1>怎么做到创业成功?来看看你具不具备这些素质</h1>
            <div class="title-info">
                <span>编辑：蜀小帅</span>
                <span>时间：2019/4/26</span>
            </div>
            <p>很多有抱负的年轻人都希望通过自己创业，获得人生事业的成功，但是创业成功者毕竟是少数，每年新创办企业中，至少有50%在半年之内倒闭，倒闭的主要原因是没有把握创业的基本法则。</p>
            <img src="./images/article_img.jpg" alt="">
            <p>
                很多人在初次创业的时候，都是资源十分欠缺的。资源不足，使企业创业成功的概率降低，但要有完全充分的资源也是不可能的。在资源具备上，一般来说，要符合两种条件：一是要有进入一个行业的起码的资源，另一方面是具备差异性资源。如果任何条件均不具备，创业成功的可能性很小。 </p>
        </article>
        <qrcode></qrcode>
        <more-article></more-article>
        <foot></foot>

    </div>
</template>

<script>
    import qrcode from "@/components/qrcode/qrcode"
    import moreArticle from "@/components/moreArticle/moreArticle"
    import foot from "@/components/foot/foot"

    export default {
        name: "NewsInfo",
        data() {
            return {}
        },
        mounted() {
        },
        components: {
            qrcode,
            foot,
            moreArticle
        }
    }
</script>

<style scoped lang="less">
    #news-info {
        /* 头部 */

        .head {
            //width: 100%;
            width: 3.325rem;
            position: fixed;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            height: 0.5rem;
            box-shadow: 0 -6px 20px rgba(0, 0, 0, .1);
            background-color: #fff;
            z-index: 999;

            span {
                position: absolute;
                top: 0.15rem;
                left: 0;
            }

            .title-img {
                width: 1.1rem;
                margin: 0 auto;
                padding-top: 0.15rem;

                a {
                    display: block;
                    width: 100%;
                    height: 100%;
                    color: #333;
                    font-size: 16px;
                    text-align: center;

                    img {
                        display: block;
                        width: 100%;
                    }
                }
            }

            .share {
                color: #333;
                position: absolute;
                top: 0.15rem;
                right: 0.14rem;
            }

            &::after {
                content: "";
                position: absolute;
                top: 0;
                left: -0.21rem;
                width: 0.22rem;
                height: 100%;
                background-color: #fff;
                z-index: 9999;
            }

            &::before {
                content: "";
                position: absolute;
                top: 0;
                right: -0.11rem;
                width: 0.22rem;
                height: 100%;
                background-color: #fff;
                z-index: 9999;
            }
        }

        /* 文章区域 */

        article {
            margin-top: 0.815rem;
            border-bottom: 0.05rem solid #eaeaea;

            h1 {
                color: #333;
                font-size: 18px;
                font-weight: normal;
                line-height: 27px;
            }

            .title-info {
                margin-top: 0.1rem;
                margin-bottom: 0.13rem;

                span {
                    color: #999;
                    font-size: 13px;
                    margin-right: 0.22rem;
                }
            }

            p {
                font-size: 15px;
                color: #666;
                line-height: 0.26rem;
                margin-bottom: 0.1rem;
                text-indent: 2em;
            }

            img {
                display: block;
                width: 100%;
                margin-bottom: 0.3rem;
            }
        }

    }
</style>
